﻿@model string

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style type="text/css">
.noti_bubble {
    position:absolute;
    top: -6px;
    right:-6px;
    padding:1px 2px 1px 2px;
    background-color:red;
    color:white;
    font-weight:bold;
    font-size:0.9em;
    
    border-radius:30px;
    box-shadow:1px 1px 1px gray;
}
.glyphicon { margin-right:5px;}
.rating .glyphicon {font-size: 22px;}
.rating-num { margin-top:0px;font-size: 54px; }
.progress { margin-bottom: 5px;}
.progress-bar { text-align: left; }
.rating-desc .col-md-3 {padding-right: 0px;}
.sr-only { margin-left: 5px;overflow: visible;clip: auto; }
</style>


<script src="~/Scripts/vacancyController.js"></script>
<script src="~/Scripts/showvacancyController.js"></script>
<script src="~/Scripts/detailvacancyController.js"></script>
<script src="~/Scripts/skillController.js"></script>
<script src="~/Scripts/applicantsController.js"></script>
<script src="~/Scripts/rankingController.js"></script>
<script src="~/Scripts/compareController.js"></script>


@section scripts {
    <script src="~/Scripts/jquery.signalR-2.1.2.min.js"></script>
    <script src="~/signalr/hubs"></script>
    <script type="text/javascript">
        $(function () {

            var IWannaChat = $.connection.chatHub;

            IWannaChat.client.addNewMessageToPage = function (a, b, c, d, e) {
                $('#listMessages').append('<li><a href="#">' +
                            '<div>' +
                            '<img  width="50" alt="User Pic" src="' + e + '" class="img-square">' +
                                '<strong> ' + c + '</strong><br/>' +
                                    '<em>' + d + ' has applied for vacancy: ' + a + '-' + b + '.</em>' +
                            '</div>' +
                    '</a></li>');
                $('.noti_bubble').html(parseInt($('.noti_bubble').html(), 10) + 1);
                $('.noti_bubble').show();
            };

            $.connection.hub.start();
        });
    </script>
}

<div style="text-align: right" id="google_translate_element"></div>
<div id="wrapper">
    <!-- Navigation -->
    <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">R4U Admin v1.0</a>
        </div>
        <!-- /.navbar-header -->


        <ul class="nav navbar-top-links navbar-right">
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                    <div class="noti_bubble" style="display:none">0</div>
                    <i class="fa fa-envelope fa-fw"></i><i class="fa fa-caret-down"></i>
                </a>
                <ul class="dropdown-menu dropdown-messages" id="listMessages">
                </ul>
                <!-- /.dropdown-messages -->
            </li>
            <!-- /.dropdown -->


            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                    <i class="fa fa-user fa-fw"></i><i class="fa fa-caret-down"></i>
                </a>
                <ul class="dropdown-menu dropdown-user">
                    <li><a href="#"><i class="fa fa-user fa-fw"></i>User Profile</a>
                    </li>
                    <li><a href="#"><i class="fa fa-gear fa-fw"></i>Settings</a>
                    </li>
                    <li class="divider"></li>


                    <li><a onclick="window.location.assign('/Login/LogOff')"><i class="fa fa-sign-out fa-fw"></i>Logout</a>


                    </li>
                </ul>
                <!-- /.dropdown-user -->
            </li>
            <!-- /.dropdown -->
        </ul>
        <!-- /.navbar-top-links -->

        <div class="navbar-default sidebar" role="navigation">
            <div class="sidebar-nav navbar-collapse">
                <ul class="nav" id="side-menu">
                    <li class="sidebar-search">
                        <div class="input-group custom-search-form">
                            <input type="text" class="form-control" placeholder="Search...">
                            <span class="input-group-btn">
                                <button class="btn btn-default" type="button">
                                    <i class="fa fa-search"></i>
                                </button>
                            </span>
                        </div>
                        <!-- /input-group -->
                    </li>
                    <li>
                        <a href="/Vacancy/New">Create New Job Vacancy
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">1</i>
                            </span>
                        </a>
                    </li>

                    <li>
                        <a href="/Vacancy/List">My Job Vacancies
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">2</i>
                            </span>
                        </a>
                    </li>

                    <li>
                        <a href="/Vacancy/Post">Publish My Job
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">3</i>
                            </span>
                        </a>
                    </li>


                    <li>
                        <a href="/Applicants/List">My Candidates
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">4</i>
                            </span>
                        </a>
                    </li>



                    @if (User.IsInRole("TRIAL"))
                    {
                        <li class="disabled">
                            <a href="/Rank">Rank Candidates
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">5</i>
                            </span>
                            </a>
                        </li>
                        
                        <li class="disabled">
                            <a href="/Compare">Compare Applicants
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">6</i>
                            </span>
                            </a>
                        </li>
                    }
                    else
                    {
                        <li>
                            <a href="/Rank">Rank Candidates
                           
                                <span class="fa-stack pull-left">
                                    <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                    <i class="fa fa-inverse fa-stack-1x">5</i>
                                </span>
                            </a>
                        </li>
                        


                        <li>
                            <a href="/Compare">Compare Applicants
                           
                                <span class="fa-stack pull-left">
                                    <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                    <i class="fa fa-inverse fa-stack-1x">6</i>
                                </span>
                            </a>
                        </li>
                    }

                    <li>
                        <a href="/Support">Conact Us
                            <span class="fa-stack pull-left">
                                <i class="fa fa-circle fa-red fa-stack-2x"></i>
                                <i class="fa fa-inverse fa-stack-1x">7</i>
                            </span>
                        </a>
                    </li>
                </ul>
            </div>
            <!-- /.sidebar-collapse -->
        </div>
        <!-- /.navbar-static-side -->
    </nav>

    <!-- Page Content -->
    <div id="page-wrapper">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    @if (User.IsInRole("TRIAL"))
                    {
                        <div class="alert alert-danger">
                            <a href="#" onclick="window.location.assign('/Payment/Index2')" class="btn btn-xs btn-danger pull-right">Upgrade to Premium</a>
                            <strong>Information:</strong> You are using trial version of R4U with limited features.
                        </div>
                    }
                    <div ng-view>
                    </div>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->
